body{
	width: 100%;
	background-color: #EBEBEB;
}
/*.container{
	margin:0;
	padding: 0;

}*/
@media screen and (min-width: 768px){
	.container{
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		/*padding-top: 20px;*/
		padding-bottom: 20px;
		padding-left: 20px;
		padding-right: 20px;
		/*border: 1px solid red;*/
		/*padding: 20px;*/
		background-color: #BAC8BF;
	}
	.box1,.box2{
		width: calc(4 * (100% - 226px) / 12 + 60px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;

		/*margin-left: 20px;*/

		margin-right: 20px;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.box3{
		width: calc(4 * (100% - 226px) / 12 + 60px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-left: 10px;*/
		/*margin-right: 20px;*/
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
	.box4{
		width: calc(3 * (100% - 226px) / 12 + 40px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-bottom: 20px;
		margin-right: 20px;
	}
	.box5{
		width: calc(6 * (100% - 226px) / 12 + 100px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box6{
		width: calc(3 * (100% - 226px) / 12 + 40px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box7,.box8{
		width: calc(1 * (100% - 230px) / 12 + 0px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box9,.box10{
		width: calc(2 * (100% - 230px) / 12 + 20px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box11{
		width: calc(6 * (100% - 230px) / 12 + 100px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.clear{
		clear: both;
	}
}

@media screen and (max-width: 768px){
	.container{
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 20px;
		padding-right: 20px;
		/*border: 1px solid red;*/
		/*padding: 20px;*/
		background-color: #BAC8BF;
	}
	.box1{
		width: calc(6 * (100% - 224px) / 12 + 100px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-left: 10px;*/
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box2{
		width: calc(6 * (100% - 224px) / 12 + 100px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-left: 10px;*/
		/*margin-right: 20px;*/
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box3{
		width: calc(12 * (100% - 222px) / 12 + 220px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-left: 10px;*/
		/*margin-right: 20px;*/
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}
	
	.box4{
		width: calc(3 * (100% - 226px) / 12 + 40px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-bottom: 20px;
		margin-right: 20px;
	}

	.box5{
		width: calc(6 * (100% - 226px) / 12 + 100px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box6{
		width: calc(3 * (100% - 226px) / 12 + 40px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box7,.box8{
		width: calc(2 * (100% - 226px) / 12 + 20px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box9{
		width: calc(8 * (100% - 226px) / 12 + 140px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		/*margin-right: 20px;*/
		/*margin-top: 20px;*/
		margin-bottom: 20px;
	}

	.box10,.box11{
		width: calc(3 * (100% - 226px) / 12 + 40px);
		background-color: #eee;
		height: 50px;
		border: 1px solid blue;
		float: left;
		margin-right: 20px;
		/*margin-top: 20px;*/
		margin-bottom: 20px;	
	}
	.clear{
		clear: both;
	}
}
